<template>
  <div>obj1: {{ obj1.b.c }}</div>
  <div>obj2: {{ obj2.b.c }}</div>
  <div>
    <button @click="update">update</button>
  </div>
</template>

<script setup>
import { shallowReactive, shallowRef, reactive, ref, toRaw } from 'vue'
const obj1 = shallowReactive({
  a: 1,
  b: {
    c: 1
  }
})
const obj2 = shallowRef({
  a: 2,
  b: {
    c: 2
  }
})
const update = () => {
  obj1.b.c++
  obj2.value.b.c++
}
</script>

<style scoped>
</style>